<template>
  <a-card>
    <s-table
      bordered
      ref="table"
      size="middle"
      :row-key="(record) => record.contract_id"
      :columns="businessColumns"
      :data="contractData"
    >
      <template slot="contract_business" slot-scope="text">
        <div v-for="(item,index) in text" :key="item.cb_id">
          {{ index + 1 }}.{{ item.business_name }}-{{ item.sb_category }}
        </div>
      </template>
      <template slot="amount" slot-scope="text,record">
        <div>
          <a-tag color="red">打款金额：{{ text }}</a-tag>
        </div>
        <div>
          <a-tag color="red">官费：{{ record.official_fee }}</a-tag>
        </div>
        <div>
          <a-tag color="red">代理费：{{ record.agency_fee }}</a-tag>
        </div>
      </template>
      <template slot="action" slot-scope="text, record">
        <a-button type="link" @click="$router.push({ name: 'ContractDetail', params: { cid: record.contract_id } })">查看</a-button>
      </template>
    </s-table>
  </a-card>
</template>

<script>
import { STable } from '@/components'
import col from '@/columns/customer'
import { getCustomerContract } from '@/api/customer'

export default {
  components: {
    STable
  },
  name: 'NewBusiness',
  data () {
    return {
      businessColumns: col.contract,
      contractData: parameters => {
        return getCustomerContract(Object.assign(parameters, this.queryParam)).then(res => {
          return res.result
        })
      },
      queryParam: {}
    }
  },
  created () {
    this.queryParam['filter[customer_id]'] = this.$route.params.id
  }
}
</script>

<style scoped>

</style>
